const BASE_URL = "https://service-kem9ftt4-1302324326.gz.apigw.tencentcs.com"
const API = {
    SEARCH: BASE_URL + '/cloudsearch',
    GETSONG: BASE_URL + '/song/url/v1'
}
const page = {
    limit: 30,
    offset: 1,
    total: 0
}

// 用于将数组里面每个对象的作者提取出来
const formatArtists = array => array.map(artist => artist.name).join("/")
//时长转换
function time(millisecond) {
    //取整计算分钟
        let number = parseInt(millisecond / 1000 / 60)
        //取整计算秒钟
        let number1 = parseInt(millisecond / 1000 % 60)
        //判断如果分钟小于10，计算的分钟就等于它自己;字符串0拼接计算的分钟
            if(number < 10) number = '0' +number
            //判断如果秒钟大于10，计算的秒钟就等于它自己;
            if(number1 < 10) number1 ='0' +number1;
            console.log(number1);
            //计算的分钟和秒钟用数组装起来
            let arr = [number,number1]
            //拼接数组把分钟和秒钟拼接起来形成时间模式
            return arr.join(':')
}

// 搜索歌曲
$("#send").click(function () {
    const value = $('#keywords').val();
    if (!value) return;

    $ajax({
        url: API.SEARCH,
        method: 'GET',
        data: {
            keywords: value,
            limit: page.limit,
            offset: (page.offset - 1) * page.limit,
        },
        isJson: true,
        callback: data => {
            // 先将列表中的数据清空，防止上一次搜索结果保留下来
            $("tbody").html("");

            // 如果遇到没有版权的作者，可能 songs 为空
            const songs = data.result.songs;
            if (!songs) return;

            // 将歌曲总数进行记录
            page.total = data.result.songCount;

            songs.forEach(song => {
                $("tbody").append(`<tr data-id="${song.id}">
                    <td>${song.name}</td>
                    <td>${formatArtists(song.ar)}</td>
                    <td>${song.al.name}</td>
                    <td>${time(song.dt)}</td>
                </tr>`)
            })
        }
    })
})

// 播放歌曲
$("tbody").click(e => {
    const songId = e.target.parentNode.dataset.id;
    if (!songId) return alert("该歌曲暂无法播放");

    $ajax({
        url: API.GETSONG + `?t=${+new Date()}`,
        method: 'POST',
        data: {
            id: songId,
            level: "standard"
        },
        isJson: true,
        callback: data => {
            $("#player").prop("src", data.data[0].url)
        },
        error: err => {
            console.log(err);
        }
    })
})

// 下一页
$("#next").click(() => {
    // 如果点击后，发现当前的页码是最后一页，则不允许执行下去
    const maxPage = Math.ceil(page.total / page.limit);
    if (page.offset === maxPage) return alert("已经是最后一页了！！！");

    page.offset++;

    const value = $('#keywords').val();
    if (!value) return;

    $ajax({
        url: API.SEARCH,
        method: 'GET',
        data: {
            keywords: value,
            limit: page.limit,
            offset: (page.offset - 1) * page.limit,
        },
        isJson: true,
        callback: data => {
            console.log(data);
            // 先将列表中的数据清空，防止上一次搜索结果保留下来
            $("tbody").html("");

            // 如果遇到没有版权的作者，可能 songs 为空
            const songs = data.result.songs;
            if (!songs) return;

            songs.forEach(song => {
                $("tbody").append(`<tr data-id="${song.id}">
                    <td>${song.name}</td>
                    <td>${formatArtists(song.ar)}</td>
                    <td>${song.al.name}</td>
                    <td>${time(song.dt)}</td>
                </tr>`)
            })
        }
    })
})
//上一页
$("#prev").click(() => {
    // 如果点击后，发现当前的页码是第一页，则不允许执行下去
    if (page.offset <= 1) return alert("已经是第一页了！！！");

    page.offset--;

    const value = $('#keywords').val();
    if (!value) return;

    $ajax({
        url: API.SEARCH,
        method: 'GET',
        data: {
            keywords: value,
            limit: page.limit,
            offset: (page.offset - 1) * page.limit,
        },
        isJson: true,
        callback: data => {
            console.log(data);
            // 先将列表中的数据清空，防止上一次搜索结果保留下来
            $("tbody").html("");

            // 如果遇到没有版权的作者，可能 songs 为空
            const songs = data.result.songs;
            if (!songs) return; 

            songs.forEach(song => {
                $("tbody").append(`<tr data-id="${song.id}">
                    <td>${song.name}</td>
                    <td>${formatArtists(song.ar)}</td>
                    <td>${song.al.name}</td>
                    <td>${time(song.dt)}</td>
                </tr>`)
            })
        }
    })
})